<template>
  <div id="contentBox">
    <div class="searchBox">
      <el-form :inline="true" ref="searchForm" :model="searchForm" label-width="96px">
        <el-form-item label="添加日期起" prop="startDate">
          <el-date-picker :editable="false" @change="debounceSeach" v-model="searchForm.startDate" type="date" placeholder="选择日期" :picker-options="startDateOpt">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="添加日期止" prop="endDate">
          <el-date-picker :editable="false" @change="debounceSeach" v-model="searchForm.endDate" type="date" placeholder="选择日期" :picker-options="endDateOpt">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="订单号" prop="orderNumber">
          <el-input v-model="searchForm.orderNumber" placeholder="请输入搜索内容..." @input.native="debounceSeach"></el-input>
        </el-form-item>
        <el-form-item label="融资经销商" prop="dealerName">
          <el-input v-model="searchForm.dealerName" placeholder="请输入搜索内容..." @input.native="debounceSeach">
          </el-input>
        </el-form-item>

        <el-form-item label="订单状态" prop="carOrderStatus">
          <el-select v-model="searchForm.carOrderStatus" placeholder="请选择" @change="debounceSeach">
            <el-option label="全部" value=""></el-option>
            <el-option v-for="(item,index) in carOrderStatus" :key="item" :label="item" :value="index">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="保证金状态" prop='cashDepositStatus'>
          <el-select v-model="searchForm.cashDepositStatus" placeholder="请选择" @change="debounceSeach">
            <el-option label="全部" value=""></el-option>
            <el-option v-for="(item,index) in cashDepositStatus" :key="item" :label="item" :value="index">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item style="float:right">
          <el-button type="success" @click="resetSearchForm('searchForm')">重置</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div id="tableBox" style="margin:0 25px;">
      <el-table :data="tableData.data" border>
        <el-table-column label="订单号" width="140" fixed>
          <template scope="scope">
            <span>{{ scope.row.orderNumber }}</span>
          </template>
        </el-table-column>
        <el-table-column label="融资经销商" >
          <template scope="scope">
            <span>{{ scope.row.dealerName }}</span>
          </template>
        </el-table-column>
        <el-table-column label=" 融资总金额(元) " min-width='200px'>
          <template scope="scope">
            <span>{{ scope.row.mortgageSumMoney| toFixed2 }}</span>
          </template>
        </el-table-column>
        <el-table-column label=" 保证金金额(元)  ">
          <template scope="scope">
            <span>{{ scope.row.deposit | toFixed2}}</span>
          </template>
        </el-table-column>
        <el-table-column label=" 订单状态">
          <template scope="scope">
            <span>{{ scope.row.carOrderStatusString}}</span>
          </template>
        </el-table-column>
        <el-table-column label=" 保证金状态">
          <template scope="scope">
            <span>{{ scope.row.cashDepositStatusString }}</span>
          </template>
        </el-table-column>
        <el-table-column label="申请时间">
          <template scope="scope">
            <span>{{ getDate(scope.row.carOrderAddTime)}}</span>
          </template>
        </el-table-column>
        <el-table-column label="保证金添加时间">
          <template scope="scope">
            <span>{{getDate(scope.row.cashDepositAddTime) }}</span>
          </template>
        </el-table-column>
        
        <el-table-column label="操作" width="140" fixed="right">
          <template scope="scope">
            <el-button size="small" @click='handleSee($event)' type="success" v-if="scope.row.cashDepositStatus==1" :data-id='scope.row.mortgageOrderExtendId'>审核</el-button>
            <el-button size="small" @click='handleSee($event)' type="info" :data-id='scope.row.mortgageOrderExtendId'>查看</el-button>
          </template>
        </el-table-column>
      </el-table>

      <el-dialog title=" 保证金管理" :visible.sync="dialogSendData.dialogFormVisible" :lock-scroll='true'
        top=5% :close-on-click-modal="false">
            <Edit v-if='dialogSendData.dialogFormVisible' :id='id' @Refresh='seachData()' :dialogSendData='dialogSendData'></Edit>
      </el-dialog>


    </div>
    <div class="block" style="text-align: center;margin-top: 15px;">
            <pagination v-on:refreshSeachData="seachData"  :tableData="tableData" :searchForm="searchForm"></pagination>
    </div>
  </div>


</template>
<script src="./index.js">


</script>

